<template>
	<view class="warp">
		<unicloud-db ref="readRef" v-slot:default="{data, loading, error, options}" :collection="collection"
			orderby="sort" getcount @load="loadData">
			<view v-if="error">{{error.message}}</view>
			<view v-else>
				<uni-list>
					<uni-list-item v-for="(item,index) in data" :key="item._id">
						<template v-slot:body>
							<view class="list">
								<view class="info">
									<image :src="item.book_id[0]?.icon" mode="aspectFill" class="info-image"></image>
									<view class="info-title">{{item.book_id[0]?.title}}</view>
								</view>
								<view style="display: flex;flex-direction: row;">
									<view class="view" v-if="item?.is_ok" @click="read(item.book_id[0]?._id)">学习</view>
									<view class="view"  v-if="item?.is_ok" :class="{active:item?.is_ok}" @click="cancle(item?._id,item?.is_ok)">核销</view>
								</view>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
				<uni-load-more :status="more"></uni-load-more>
			</view>
		</unicloud-db>
	</view>
</template>

<script>
	const db = uniCloud.database();
	import {
		mapState,
		mapActions
	} from 'pinia'
	import {
		useUserStore
	} from "@/pinia/user.js"
	const readProfit = uniCloud.importObject('two-plus-one')


	export default {
		name: "wolf-share-header",
		data() {
			return {
				more: "more",
				readList: [],
			}
		},
		computed: {
			...mapState(useUserStore, ['userInfo', 'sysSetting']),
			collection() {
				return [
					db.collection('wolf-reading-log').where(`user_id=='${this.userInfo._id}'`).orderBy('create_time desc').getTemp(),
					db.collection("wolf-read").field("_id,icon,title").getTemp()
				]
			}
		},
		onLoad() {
			this.load()
		},
		methods: {
			...mapActions(useUserStore, ['updateUserInfo']),
			//加载具备阅读权限的数据
			async load() {
				let res = await db.collection('wolf-reading-log').where(`user_id=='${this.userInfo._id}'`).field('_id')
					.get()
				this.readList = res.result.data.map(item => item._id)
			},
			loadData(data, e) {
				for (var i = 0; i < data.length; i++) {
					if(!data[i].book_id[0]){
						data[i].book_id = [{
							title:"文章已删除"
						}]
					}
				}
				console.log("data=======>",data);
				if (e) {
					this.more = "no-more"
				} else {
					this.more = "more"
				}
			},
			loadMore() {
				this.$refs.readRef.loadMore()
			},
			cancle(id,type){//核销
				if(!type){//已经失效
					return uni.showToast({
						icon:'none',
						title:"已经核销了"
					})
				}
				let _that = this
				uni.showModal({
					title:"提示",
					content:"参加线下学习时,\n由公司检票员进行核销,\n 切勿自行点击核销!!!",
					confirmText:"确定核销",
					success(res) {
						if(res.confirm){
							_that.opDb(id)
						}
					}
				})
			},
			async opDb(id){
				uni.showLoading({
					icon:'none'
				})
				await db.collection("wolf-reading-log").doc(id).update({
					is_ok:0
				})
				uni.hideLoading()
				this.$refs.readRef.refresh()
			},
			read(id, price) {
				this.navigator(id)
			},
			navigator(id) {
				uni.navigateTo({
					url: `/pages/book/reading?id=${id}`
				})
			}
		},
		onReachBottom() {
			if (this.more == "more") {
				this.more = "loading"
				this.loadMore()
			}
		}
	}
</script>

<style scoped lang="scss">
	view {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
	}

	.list {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		flex: 1;

		.info {
			flex-direction: row;

			&-image {
				width: 50rpx;
				height: 50rpx;
				border-radius: 10rpx;
				margin-right: 10rpx;
			}

			&-title {
				font-weight: 700;
			}
		}

		.view {
			background-color: #e8e8e8;
			padding: 5rpx 10rpx;
			border-radius: 5rpx;
			margin: 0 10rpx;
		}

		.active {
			background-color: #ea6cf5;
		}

	}
</style>